<!--
 * @company : 版权所属 四川北星惯牌科技有限公司
 * @contact : 刘经理 19326416371
 -->
<template>
	<view class="match-box">
		<view class="content w100 flex-row-center" v-if="matchInfo.organizer">
			<text class="text name">举办方:</text>
			<text class="text">{{matchInfo.organizer}}</text>
		</view>
		<view class="content w100 flex-row-center">
			<text class="text name">举办时间:</text>
			<text class="text">{{matchInfo.holding_time_text}}</text>
		</view>
		<view class="content w100 flex-row-center" v-if="matchInfo.holding_address">
			<text class="text name">申请时间:</text>
			<text class="text" style="margin-left: 12rpx;">{{matchInfo.create_time_text}}</text>
		</view>
		<view class="content w100 flex-row-center" v-if="matchInfo.charge">
			<text class="text name">负责人:</text>
			<text class="text">{{matchInfo.charge}}</text>
		</view>
		<view class="content w100 flex-row-center" v-if="matchInfo.store_name">
			<text class="text name">发布门店:</text>
			<text class="text" style="margin-left: 12rpx;">{{matchInfo.store_name}}</text>
		</view>
		<view class="content w100 flex-row-center" v-if="matchInfo.holding_address">
			<text class="text name">举办地址:</text>
			<text class="text" style="margin-left: 12rpx;">{{matchInfo.holding_address}}</text>
		</view>
		<view class="content w100 flex-row-center" v-if="matchInfo.holding_address">
			<text class="text name">参赛人数:</text>
			<text class="text" style="margin-left: 12rpx;">{{matchInfo.personal}}</text>
		</view>

		<view class="content w100 flex-row-center">
			<text class="text name">人均预算: </text>
			<text class="price">￥{{matchInfo.avg_amount}}</text>
		</view>
		<view class="content w100 flex-row-center">
			<text class="text name">审核状态:</text>
			<template>
				<!--  0=初始化  1=审核通过 2=审核中 3=拒绝   -->
				<text class="status err" v-if="matchInfo.status==3">已拒绝</text>
				<text class="status sucss" v-else-if="matchInfo.status==1">审核通过</text>
				<text class="status ing" v-else>审核中</text>
			</template>
		</view>
		<view class="content w100 flex" v-if="matchInfo.status==3">
			<text class="text name">审核原因: <!-- <text class="reason">{{matchInfo.reason}}</text> --> </text>
			<view class="reason">
				<up-parse :content="matchInfo.reason"></up-parse>
			</view>
		</view>
	<!-- 	<view class="option-box flex-row-center">
			<view class="option-btn flex-center" @click="resubmit(matchInfo)" v-if="matchInfo.status==3">
				<text class="text">重新提交</text>
			</view>
			<view class="option-btn flex-center">
				<up-icon name="server-fill" color="#66807D" size="28rpx"></up-icon>
				<text class="text" style="margin-left: 8rpx;">咨询平台</text>
			</view>
		</view> -->
	</view>
</template>

<script setup>
	const props = defineProps({
		matchInfo: {
			default: {}
		}
	});
	const matchInfo = ref(computed(() => props.matchInfo));
	// import {
	// 	matchInfoStore
	// } from '@/stores/match';
	// const matchStore = matchInfoStore();
	// const resubmit = () => { //重新提交
	// 	matchStore.setResubmitMatch(matchInfo.value);
	// 	uni.redirectTo({
	// 		url: '/page_store/views/publishMatch'
	// 	})
	// }
</script>

<style lang="scss" scoped>
	.match-box {
		width: 100%;
		background-color: $activityItem-bg-color;
		border-radius: 20rpx;
		padding: 32rpx 20rpx;
		box-sizing: border-box;

		.head {
			justify-content: space-between;

			.name {
				font-weight: bold;
				font-size: 34rpx;
				color: $name-color;
				margin: 0 4rpx 0 16rpx;
			}


		}

		.content {
			justify-content: space-between;
			padding: 12rpx 0;
			color: $description-color;

			&:not(:last-child) {
				border-bottom: 2rpx solid #2B2E31;
			}

			.name {
				flex-shrink: 0;
				flex-shrink: 0;
			}

			.status {
				font-size: 28rpx;
				color: $status-text-color;
			}

			.text {
				color: $description-color;
				font-size: 28rpx;
			}

			.reason {
				margin-left: 12rpx;
				flex: 1;
				word-wrap: break-word;
				overflow: hidden;
			}
			.reason text{
				word-wrap: break-word !important;
			}

			.price {
				color: $price-color;
			}

			.err {
				color: #F56C6C;
			}

			.sucss {
				color: #5AC725;
			}

			.ing {
				color: #F9AE3D;
			}
		}

		.option-box {
			justify-content: flex-end;
			margin-top: 24rpx;

			.option-btn {
				height: 54rpx;
				border-radius: 27rpx;
				background: $btn-bg-color;
				width: 180rpx;
				margin-left: 18rpx;

				.text {
					color: $btn-text-color;
					font-size: 26rpx;
				}
			}
		}
	}
</style>